<template>
  <div>
    <div>
        <search-table :url="url"
                      ref="searchtable"
                      :hideSelect="true"
                      :columns="columns"
                      :form="form"
                      style="margin-top:20px;">

        <template slot="searchForm">
          <a-form layout="inline"
                  :form="form">
            <a-form-item label="商品名称">
              <a-input v-decorator="['goodsName']"
                       placeholder="请输入商品名称">
              </a-input>
            </a-form-item>


            <a-form-item>
              <a-button type="primary" class="searchBtn" icon="search" @click="searchData">搜索</a-button>
            </a-form-item>

            <a-form-item>
              <a-button type="primary" class="searchBtn" icon="reload" @click="resertSearchData">重置</a-button>
            </a-form-item>

            <a-form-item >
              <a-button @click="addGoods"  type="primary">
                <a-icon type="plus" :style="{ fontSize: '16px', color: 'white' }" />新增商品</a-button>
            </a-form-item>

          </a-form>
        </template>


        <template slot="tableOperation" slot-scope="{ record }">
           <permission authority="">
                <a-button type="primary"  @click="togoodsCodePage(record)" >商品编码</a-button>
          </permission>
          <a-divider type="vertical"></a-divider>

          <permission authority="">
            <!--<span class="text-primary pointer" @click="searchGoods(record)">编辑</span>-->
            <a-button type="primary"  @click="searchGoods(record)" >查看</a-button>
          </permission>
          <a-divider type="vertical"></a-divider>

          <permission authority="">
            <!--   <span class="text-primary pointer" @click="deletes(record)" >删除</span>-->
            <a-button type="danger"  @click="deletes(record)" >删除</a-button>
          </permission>

        </template>

      </search-table>

    </div>
  </div>
</template>

<script>
  import SearchTable from "./components/SearchTable";
  export default {
    name: "giveaway",
    components: {
      SearchTable
    },
    created() {

    },
    data() {
      return {
    /*    pagination: {
          showQuickJumper: true,
          total: 0,
          current: null,
          pageSize: 10,
          showTotal: (total) => `共${ total }条`,
          showSizeChanger: true,
          pageSizeOptions: ['10', '20', '50', '100', '200']
        },*/

        goodsTypeList:[{label:'全部',value:''},{label:'商品',value:'1'},{label:"付费会员卡",value: "2"}],
        // url: 'goldenhome/member/admin_/benefits/card/page',
        url: 'goldenhome/gh/lottery_/admin/self/buildgoods/page',
        form: this.$form.createForm(this, {name: 'table_search'}),
        columns: [
          {
            title: '商品名称',
            dataIndex: 'goodsName',
            key: 'goodsName',
            // align: 'center',
            customRender:(text,row)=>{
              return <div class="product_td"><table-img src={row.goodsPicture}/><div class="product_name">{text}</div></div>
            }
          },
          {
            title: '商品总数',
            dataIndex: 'stock',
            key: 'stock'
          },
          {
            title: '商品实际剩余库存数',
            dataIndex: 'remainStock',
            key: 'remainStock'
          },
          {
            title: '赠品库领用',
            dataIndex: 'manageStock',
            key: 'manageStock',
            align: 'center'
          },

          {
            title: '已被用户领取',
            dataIndex: 'received',
            key: 'received',
          },
          {
            title: '创建时间',
            dataIndex: 'createDate',
            key: 'createDate',
          },
          {
            title: '操作',
            dataIndex: 'operation',
            key: 'operation',
            scopedSlots: {customRender: 'operation'}
          }
        ],

      }
    },
    methods: {
      searchData(){
        this.$refs.searchtable.handleSearch()
      },

      resertSearchData(){
        console.log("重置搜索条件")
        this.form.resetFields()
        this.searchData()
        /*   this.form.setFieldsValue({
             cardName:'',
             status: "1"
           })*/
      },

      searchGoods(record){
        // 跳到修改赠品页面
        console.log(record)
        this.$router.push({
          name: 'MarketingSelfCreateGoodPagesEditGoods',
          query: {
            // id: record.goodsId,
            goodsName: record.goodsName,
            goodsPicture: record.goodsPicture,
            stock: record.stock,
            // givingType: record.givingType,
            // goodsSpecId: record.goodsSpecId,
            // norm: record.norm,
            // current:this.pagination.current
          }
        })
      },

      addGoods() {
        // 跳到添加商品页面
        this.$router.push({
            name: 'MarketingSelfCreateGoodPagesAddGoods'
          })
      },

      deletes(record){
        // this.$set(this,"name","wf");  这是不允许的
        console.log("删除赠品",record)
        this.$confirm({
          title: '显示提示',
          content: `删除该商品吗?`,
          okText: '确认',
          cancelText: '取消',
          onOk: ()=> {
            this.$post('goldenhome/gh/lottery_/admin/self/buildgoods/delete',{id:record.id}).then(res => {
              if (res && res.returnCode == 1000) {
                if (res && res.returnCode === 1000) {
                  this.$message.success('操作成功!')
                  this.$refs.searchtable.refreshTable()
                }
              }
            })
          }
        })
      },
      togoodsCodePage(record){
        // 跳
        this.$router.push({
          name: 'MarketingSelfCreateGoodPagesGoodsCode',
          query:{
            id:record.id,
            goodsName:record.goodsName,
            goodsPicture:record.goodsPicture,
          }


        })
      }
    },
  }

</script>

<style scoped lang="less">
  .product_td{
    display: flex;
    align-items: center;
  .product_name{
    margin-left:6px;
  }
  }
</style>